<template>
  <div class="wh100">
    <van-grid :column-num="3"
              :gutter="10">
      <van-grid-item v-for="(item,index) in mainRoutes"
                     :key="index"
                     @click="jumpPage(item)"
                     :icon="item.icon"
                     :text="item.title" />
    </van-grid>
  </div>
</template>

<script> 
import { mapState } from 'vuex'
export default {
  name: 'appMenu',
  components: {},
  computed: {
    ...mapState({
      mainRoutes (state) {
        const arrGroup = this.$arrayGroup(state.permission.routes, "type")
        const re = this.$getTypeName(arrGroup, "type", "1", {})
        if (re && re.data) {
          return re.data
        }
        else {
          return []
        }
      },
    })
  },
  data () {
    return {
    }
  },
  watch: {
  },
  created () {
  },
  mounted () {
    console.log(this.mainRoutes)
  },
  destroyed () {
  },
  methods: {
    jumpPage (item) {
      this.$jumpPage(item.url, item)
    }
  }
}
</script>

<style lang="scss">
</style>
